Drawing with Images

In this tutorial we load some images from our apps data folder and learn more about mojo.graphics.

Import mojo

Class Game Extends App

Field image:Image

Method OnCreate()
SetUpdateRate 30
image=LoadImage("monkey64.png")
End

Method OnRender()
Cls
DrawImage image,20,20
End

End

Function Main()
New Game()
End

Create a new Cerberus X file, paste the above code, and save as "game.cxs" in a new folder on your computer.

This app, when run, produces a black display as the LoadImage command will fail to find the file monkey64.png.

In the same folder that you saved "game.cxs" create a new directory named "game.data". Copy this image to the newly created .data folder.

Add Points where you Click

Now we add a new Point class that contains an x y coordinate pair using floating point values.

Class Point
Field x#
Field y#
End

We also add a List container to manage the Points that we store each time the user clicks on the screen.

Field points:=New List<Point>

The := syntax is a shortcut for a standard equate that infers the type of the Left Hand Side (LHS) from the type on the Right Hand Side (RHS). In this case the Field named points of type List<Point> could have also been declared and initialized using the longer winded:

Field points:List<Point>=New List<Point>

The type List<Point> is an example of a Cerberus X template. A List<Point> supports the standard List interface but specifically for objects of type Point.

Import mojo

Class Point
Field x#
Field y#
End

Class Game Extends App

Field image:Image
Field points:=New List<Point>

Method OnCreate()
SetUpdateRate 30
image=LoadImage("monkey64.png")
End

Method AddPoint(x#,y#)
Local p:Point=New Point
p.x=x
p.y=y
points.AddLast p
End

Method OnUpdate()
If MouseHit() AddPoint MouseX,MouseY
End

Method OnRender()
Cls
For Local point:=Eachin points
DrawImage image,point.x,point.y
Next
End

End

Function Main()
New Game()
End

The AddLast method is called on the list to add an entry each time the user clicks the mouse.

The OnRender method draws the list of monkeys by using the enumeration

For Local point:=Eachin points

This allows Cerberus X code to process each element of the list in the order they were added.